<template>
  <div>
    <el-table
    :data="tData"
    style="width: 100%">
    <el-table-column prop="food" label="菜品名称" sortable></el-table-column>
    <el-table-column prop="num" label="菜品数量" sortable></el-table-column>
    <el-table-column prop="price" label="菜品价格" sortable></el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  
  <el-form :inline="true">
          <el-button type="primary" icon="el-icon-search" @click="sendOrders()">结账</el-button>
          <el-input
            type="textarea"
            :rows="2"
            placeholder="备注"
            style="width:400px;margin-left:20px;margin-top:20px"
            v-model="tip">
          </el-input>

  </el-form>
  </div>
</template>

<script>
import axios from 'axios';
  export default {
    data() {
      return {
        tip:'',
        tableData: [{
          date: '2016-05-02',
          name: '吮指原味鸡',
          number: '1',
          price: '10'
        }, {
          date: '2016-05-04',
          name: '上校鸡块',
          number: '5',
          price: '10'
        }, {
          date: '2016-05-01',
          name: '香辣鸡腿堡',
          number: '2',
          price: '10'
        }, {
          date: '2016-05-03',
          name: '无糖可乐',
          number: '1',
          price: '10'
        }],
        tData: [],
        params: []
      }
    },
    created() {
          this.getSelect();
      },
    methods: {
      handleEdit(index, row) {
        console.log(index, row);
      },
      handleDelete(index, row) {
        console.log(index, row);
        // for (let i = 0; i < this.params.length; i++) {
        //     if (this.params[i] === row.name) {
        //       this.params.splice(i, 1);
        //       break;
        //     } 
        //   }
        //   for (let i = 0; i < this.tData.length; i++) {
        //     if (this.tData[i].name === row.name) {
        //       this.tData.splice(i, 1);
        //       break;
        //     } 
        //   }
        axios.put(`/customer/shop/cart/delfood`,{food:row.food})
        .then((res)=>{
          if(res.data.state !== 0) this.$message.error("删除失败")
          this.$message.success("删除成功")
        })
        this.getSelect()
      },
      async getSelect() {
          axios.post(`/customer/shop/cart/get`,{
        })
        .then((res) => { 
          this.tData = res.data.foods;
          // for (let i = 0; i < this.tData.length; i++) {
          //   this.params.push(this.tData[i].name);
          // }
          console.log("post data")
          console.log(this.tData)
        })
        },
         sendOrders() {
          console.log("sendOrders!");
          console.log(this.params);
          // const { data: resp } = await this.$http.post(`http://127.0.0.1:4523/m1/2014124-0-default/student/select/`, this.params);
          // if (resp == 400) return this.$message.error(resp.msg);//对于返回值做了一个处理
          axios.post(`/customer/shop/cart/submit`,{tip:this.tip})
          .then((res)=>{
            console.log("订单提交")
            console.log(res)
            if(res.data.state !== 0) this.$message.error("订单提交失败")
            else this.$message.success("订单提交成功")
            axios.put(`/customer/out`,{})
            this.getSelect()
          })
        }
    }
  }
</script>